<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>收费账单</title>
    <!-- 引入layui 样式-->
    <link rel="stylesheet" href="../../static/css/font-awesome.min.css">
    <link rel="stylesheet" href="../../static/layer/css/layui.css"/>
    <style type="text/css">
        .shoufei-jiben-info {
            width: 100%;
            margin-bottom: 20px;
            padding: 30px 30px;
            box-sizing: border-box;
            background-color: #ffffff;
        }

        .charge-box {
            padding: 15px 0;
            border-bottom: 1px dashed #e6eef6;
        }

        .tab-body {
            background-color: #f4f4f4;
            padding: 20px;
            margin-bottom: 50px;
        }

        .blockquote-bottom {
            width: 100%;
            position: fixed;
            margin: 0;
            bottom: 0;
            left: 0;
            text-align: center;
            background-color: #ffffff;
            border-top: 1px solid #f4f4f4;
            z-index: 2;
        }

        .blockquote-bottom-item {
            margin: 15px 0;
        }

        .label-money {
            position: absolute;
            top: 10px;
            right: 5px;
            font-size: 14px;
            color: #c5d0da;
        }

        .layui-form-label1 {
            position: relative;
            float: left;
            display: block;
            padding: 15px 15px;
            width: 95px;
            font-weight: normal;
            line-height: 20px;
            text-align: right;
        }
    </style>
</head>
<body>
<form class="layui-form">
    <div class="layui-tab-content">
        <div class="tab-body">
            <div class="charge-box">
                <!--基本信息-->
                <div class="shoufei-jiben-info">
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            基本信息
                        </div>
                    </div>
                    <hr>
                    <input type="hidden" name="BILL_ID" id="ID">
                    <div class="layui-row">
                        <div class="layui-col-xs8">
                            <label class="layui-form-label">借款方</label>
                            <div class="layui-inline">
                                <input type="text" name="COMPANY_NAME" id="COMPANY_NAME" lay-verify="title"
                                       autocomplete="off"
                                       placeholder="账单房源" class="layui-input" readonly>
                            </div>
                        </div>
                        <div class="layui-col-xs4">
                            <label class="layui-form-label">别名</label>
                            <div class="layui-inline">
                                <input type="text" name="BY_NAME" id="BY_NAME" lay-verify="title"
                                       autocomplete="off"
                                       placeholder="别名" class="layui-input" readonly>
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="layui-row">
                        <div class="layui-col-xs8">
                            <label class="layui-form-label">账单周期</label>
                            <div class="layui-input-inline">
                                <input type="text" name="START_DATE" id="START_DATE" class="layui-input"
                                       placeholder="开始时间" disabled>
                            </div>
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <input type="text" name="END_DATE" id="END_DATE" class="layui-input"
                                           placeholder="结束时间" disabled>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs4">
                            <label class="layui-form-label">应付款时间</label>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" id="PAY_DATE" name="PAY_DATE" placeholder="应收租日期"
                                       disabled>
                            </div>
                        </div>
                    </div>
                </div>
                <!--收费信息-->
                <div class="shoufei-jiben-info">
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            <span class="shoufei_logo">收费</span>信息
                        </div>
                    </div>
                    <hr>
                    <div class="layui-row">
                        <div class="layui-col-xs12">
                            <table class="layui-table" lay-skin="line" lay-filter="sfxx">
                                <colgroup>
                                    <col width="200">
                                    <col width="200">
                                    <col width="200">
                                </colgroup>
                                <thead>
                                <tr>
                                    <th>费用名称</th>
                                    <th><span class="yingshou_logo">应收</span>金额(元)</th>
                                    <th><span class="shifu_logo">实收</span>金额(元)</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <td id="billName">金额</td>
                                    <td id="zujin"></td>
                                    <td id="ACT_PAY_PRICEtd"><input type="number" class="layui-input" id="ACT_PAY_PRICE"
                                                                    name="" placeholder=""></td>

                                </tr>

                                <tr class="znj">
                                    <td>滞纳金</td>
                                    <td id="isLATE"></td>
                                    <td id="isLATEtd"><input type="number" class="layui-input" id="LATE_FEE" name=""
                                                             placeholder=""></td>

                                </tr>
                                <tr>
                                    <td>费用小计</td>
                                    <td id="xiaoji"></td>
                                    <td id="ACT_xiaojitd"><input type="number" class="layui-input" id="ACT_xiaoji"
                                                                 name="" placeholder=""></td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <!--支付信息-->
                <div class="shoufei-jiben-info">
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            支付信息
                        </div>
                    </div>
                    <hr>
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            <label class="layui-form-label">付款方式</label>
                            <div class="layui-inline" style="width: 161.84px">
                                <select name="PAY_METHOD" lay-verify="required" lay-search="">
                                    <option value="现金">现金</option>
                                    <option value="银行代扣">银行代扣</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-col-xs6">
                            <label class="layui-form-label1">收款账户</label>
                            <div class="layui-inline">
                                <!--<select name="ALLOT_BILL" lay-verify="required" lay-search="" disabled>
                                    <option id="select1" value="公户" >公户</option>
                                    <option id="select2" value="私户" >私户</option>
                                </select>-->
                                <input type="text" class="layui-input" id="select1" name="COLLECTION_TYPE"
                                       placeholder="" readonly>

                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            <label class="layui-form-label">支付流水号</label>
                            <div class="layui-inline">
                                <input type="text" class="layui-input" id="" name="PAY_TRANSACTION" placeholder="流水号">
                            </div>
                        </div>
                        <div class="layui-col-xs6">
                            <label class="layui-form-label1">实际支付日期</label>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" id="ACT_PAY_DATE" name="ACT_PAY_DATE"
                                       placeholder="实际支付日期">
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="layui-row">
                        <div class="layui-col-xs6">
                            <label class="layui-form-label"><span class="shishou_logo">收费</span>金额</label>
                            <div class="layui-inline">
                                <input type="number" class="layui-input" id="PAY_PRICE" name="PAY_PRICE" placeholder=""
                                       readonly>
                                <span class="label-money">元</span>
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="zhangdan-jiben-info">
                        <label class="layui-form-label">备注</label>
                        <div>
                            <div class="layui-input-block">
                                <textarea placeholder="请输入内容" name="INFO" id="INFO" class="layui-textarea"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="layui-row">
                        <input type="checkbox" name="IS_RECEIPT" id="IS_RECEIPT" lay-skin="primary" title="发票"
                               disabled>
                    </div>
                </div>
                <div class="addzfxx"></div>
                <hr>
                <blockquote class="layui-form-item operate-button-group blockquote-bottom">
                    <div class="blockquote-bottom-item">
                        <button class="layui-btn layui-btn-small" lay-submit="" lay-filter="chargeadd">确定</button>
                        <button type="reset" class="layui-btn layui-btn-small layui-btn-primary cancel">取消</button>
                    </div>
                </blockquote>
            </div>
        </div>
    </div>
    </div>
</form>
<script type="text/javascript" src="../../static/layer/layui.js"></script>
<script type="text/javascript" src="../../static/js/common/queryUtils.js"></script>
<script type="text/javascript" src="../../static/js/common/dateUtils.js"></script>
<script>
    var isLATE = QueryUtils.GetQueryString("isLATE");//获取是否有 滞纳金
    var BYNAME = QueryUtils.GetQueryString("BYNAME");//获取账单类型
    var COMPANY_NAME = QueryUtils.GetQueryString("COMPANY_NAME");//获取借款方
    var FIX_PRICE = QueryUtils.GetQueryString("FIX_PRICE");//装修押金标识
    var payment_logo = QueryUtils.GetQueryString("payment_logo");//收费标识  1 支出
    //alert(billType)
    var uploadfiles = new Array(); // 要上传的文件列表路径
    layui.use(['jquery', 'element', 'layer', 'laydate', 'form', 'table', 'upload'], function () {
        $ = layui.jquery, element = layui.element, layer = layui.layer, laydate = layui.laydate, form = layui.form, table = layui.table;
        var upload = layui.upload;
        //开始日期
        laydate.render({
            elem: '#START_DATE'
            , format: 'yyyy-MM-dd'
        });
        //结束日期
        laydate.render({
            elem: '#END_DATE'
            , format: 'yyyy-MM-dd'
        });
        //应付款时间
        var today = DateUtils.dateFormat(new Date(), "yyyy-MM-dd"); // 今天的日期
        laydate.render({
            elem: '#ACT_PAY_DATE'
            , format: 'yyyy-MM-dd'
        });

        $("#ACT_PAY_DATE").val(today);
        //加载收费页  关键字 信息
        if ("1" == payment_logo) {
            $(".shoufei_logo").html("支付");
            $(".yingshou_logo").html("应付");
            $(".shifu_logo").html("实付");
            $(".shishou_logo").html("实付");
        }

        var billID = QueryUtils.GetQueryString("BILL_ID");//账单ID
        //加载账单信息
        var init = {
            initBill: function (billID) {
                //获取 账单基本信息
                $.ajax({
                    url: "/billController/listBill/",
                    data: {ID: billID},
                    dataType: "json",
                    type: "post",
                    async: false,
                    success: function (res) {
                        if (res.errcode === "0") {
                            //加载 账单基本信息
                            $("#ID").val(res.data.ID);
                            $("#COMPANY_NAME").val(COMPANY_NAME);//跳转获取的 房号
                            $("#BY_NAME").val(BYNAME);//
                            $("#START_DATE").val(res.data.START_DATE);
                            $("#END_DATE").val(res.data.END_DATE);
                            $("#PAY_DATE").val(res.data.PAY_DATE);
                            //收费信息
                            var zujin = res.data.TOTAL_PRICE;
                            var yajin = res.data.BOND;
                            var zafei = res.data.TOTAL_PRICE;
                            $("#zujin").html(zujin);
                            if (typeof(zujin) == "undefined" || yajin == "undefined") {
                                zujin = 0;
                                yajin = 0;
                            }
                            //绘制下拉框
                            if ("公户" === res.data.ALLOT_BILL) {
                                $("#select1").val(res.data.ALLOT_BILL);
                                $("#IS_RECEIPT").attr("checked", "checked");
                            }
                            if ("私户" === res.data.ALLOT_BILL) {
                                $("#select1").val(res.data.ALLOT_BILL);
                                $("#select2").attr("selected", "selected");
                            }
                            form.render("select");
                            form.render("checkbox");
                            $("#xiaoji").html(parseFloat(zujin).toFixed(2));//计算小计
                            $("#PAY_PRICE").val(zujin);
                            $("#ACT_PAY_PRICE").val(zujin);
                            $("#ACT_xiaoji").val(parseFloat(zujin).toFixed(2));//计算小计
                            //识别 是否有 滞纳金
                            $(".znj").hide();
                            if ("0" != isLATE & "" != isLATE & null != isLATE & "undefined" != isLATE & isLATE > 0) {
                                //生成滞纳金 收款支付信息
                                $(".addzfxx").html(`<div class="shoufei-jiben-info">
                                                        <div class="layui-row\">
                                                            <hr>
                                                            <div class="layui-col-xs6">
                                                                滞纳金
                                                            </div>
                                                        </div>
                                                        <hr>
                                                        <div class="layui-row">
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">付款方式</label>
                                                                <div class="layui-inline">\n" +
                                                                   <select name="PAY_METHODznj" lay-verify="required" lay-search="">
                                                                        <option value="现金">现金</option>
                                                                        <option value="银行代扣">银行代扣</option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">收款账户</label>
                                                                <div class="layui-inline">
                                                                    <select name="ALLOT_BILLznj" lay-verify="required" lay-search="">
                                                                        <option id="select1" value="公户" >公户</option>
                                                                        <option id="select2" value="私户" >私户</option>
                                                                    </select>


                                                                </div>
                                                            </div>
                                                        </div>
                                                       <br>
                                                        <div class="layui-row">
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">支付流水号</label>
                                                                <div class="layui-inline">
                                                                    <input type="text" class="layui-input" id="" name="PAY_TRANSACTIONznj" placeholder="流水号">
                                                                </div>
                                                           </div>
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">实际支付日期</label>
                                                                <div class="layui-input-inline">
                                                                    <input type="text" class="layui-input" id="ACT_PAY_DATEznj" name="ACT_PAY_DATEznj"
                                                                           placeholder="实际支付日期">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="layui-row">
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">收款金额</label>
                                                                <div class="layui-inline">
                                                                   <input type="number" class="layui-input" id="PAY_PRICEznj" name="PAY_PRICEznj" placeholder=""
                                                                          readonly>
                                                                    <span class="label-money">元</span>
                                                                </div>
                                                            </div>
                                                            <div class="layui-col-xs6">
                                                                <label class="layui-form-label">备注</label>
                                                                <div class="layui-inline">
                                                                    <input type="text" class="layui-input" id="INFOznj" name="INFOznj" placeholder="">
                                                                </div>
                                                           </div>
                                                            <div class="layui-row">
                                                                <input type="checkbox" name="IS_RECEIPT" id="IS_RECEIPT" lay-skin="primary" title="发票"
                                                                       >
                                                            </div>
                                                        </div>
                                                    </div>`);

                                laydate.render({
                                    elem: '#ACT_PAY_DATEznj'
                                    , format: 'yyyy-MM-dd'
                                });
                                $("#ACT_PAY_DATEznj").val(today);
                                form.render("select");
                                form.render("checkbox");
                                $(".znj").show();
                                $("#isLATE").html(isLATE);
                                $("#LATE_FEE").val(parseFloat(isLATE).toFixed(2));
                                $("#PAY_PRICEznj").val(parseFloat(isLATE).toFixed(2));
                                $("#xiaoji").html((parseFloat(zujin) + parseFloat(isLATE)).toFixed(2));//计算小计
                                $("#ACT_xiaoji").val((parseFloat(zujin) + parseFloat(isLATE)).toFixed(2));//计算小计
                            }

                            //附件展示
                            var attachments = res.attachmentData;
                            if (!!attachments) {
                                var host = location.host;
                                for (var i = 0; i < attachments.length; i++) {
                                    var attachment = attachments[i];
                                    var demoListView = $('#demoList');
                                    var tr = $(['<tr id="upload-' + (i + 1) + '">'
                                        , '<td><img src="http://' + host + '/' + attachment.PATH + '" alt="' + attachment.NAME + '" class="layui-upload-img"></td>'
                                        , '<td>' + attachment.NAME + '</td>'
                                        , '<td>' + (attachment.SIZE / 1014).toFixed(1) + 'kb</td>'
                                        , '<td><span style="color: #5FB878;">上传成功</span></td>'
                                        , '<td>'
                                        , '<span><a href="http://' + window.location.host + '/' + attachment.PATH + '" target="_blank" class=\"layui-btn layui-btn-mini layui-btn-normal\">下载</a></span>\n'
                                        , '</td>'
                                        , '</tr>'].join(''));
                                    demoListView.append(tr);

                                    var obj = {};
                                    obj.id = attachment.ID;
                                    obj.name = attachment.NAME;
                                    obj.size = attachment.SIZE;
                                    obj.ext = attachment.EXT;
                                    obj.url = attachment.PATH;
                                    //uploadfiles.push(obj);
                                }
                            }


                        } else if (res.errcode === "1") {
                            layer.msg(res.errmsg, function () {
                            });
                        }
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        console.error(XMLHttpRequest.status);
                        console.error(XMLHttpRequest.readyState);
                        console.error(textStatus);
                    }
                });
            }
        }
        init.initBill(billID);


        //输入金额 自动加小数点
        $("#ACT_PAY_PRICE").blur(function () {
            $(this).val(parseFloat($(this).val()).toFixed(2));
            if ("" != $("#LATE_FEE").val()) {
                $("#PAY_PRICE").val(parseFloat($("#ACT_PAY_PRICE").val()).toFixed(2));
                $("#ACT_xiaoji").val((parseFloat($("#ACT_PAY_PRICE").val()) + parseFloat($("#LATE_FEE").val())).toFixed(2));//租金实际付款
                $("#PAY_PRICEznj").val(parseFloat($("#LATE_FEE").val()).toFixed(2));
            } else {
                $("#PAY_PRICE").val(parseFloat($("#ACT_PAY_PRICE").val()).toFixed(2));
                $("#ACT_xiaoji").val((parseFloat($("#ACT_PAY_PRICE").val()).toFixed(2)));//租金实际付款
            }
        });
        $("#LATE_FEE").blur(function () {
            $(this).val(parseFloat($(this).val()).toFixed(2));
            $("#ACT_xiaoji").val((parseFloat($("#ACT_PAY_PRICE").val()) + parseFloat($("#LATE_FEE").val())).toFixed(2));//租金实际付款
            $("#PAY_PRICE").val(parseFloat($("#ACT_PAY_PRICE").val()).toFixed(2));
            $("#PAY_PRICEznj").val(parseFloat($("#LATE_FEE").val()).toFixed(2));
        });


        //监听提交
        form.on('submit(chargeadd)', function (data) {
            var data = data.field;
            data.ATTACHMENT = uploadfiles;
            data.FIX_PRICE = FIX_PRICE;
            layer.msg('确认收款吗', {
                time: 0
                , btn: ['确定', '取消']
                , shade: 0.3
                , yes: function (index) {
                    $.ajax({
                        url: "/billController/savebillpay",
                        data: data,
                        dataType: "json",
                        type: "post",
                        async: false,
                        success: function (res) {
                            if (res.errcode === "0") {
                                var i = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(i);  // 关闭修改房间页面
                                parent.layer.msg("收款成功", {offset: '150px'});   // 父页面弹出修改成功
                                window.parent.frames[0].reloadszTbale();//刷新 未收账单
                            } else if (res.errcode === "1") {
                                layer.msg(res.errmsg, function () {
                                });
                            }
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            console.error(XMLHttpRequest.status);
                            console.error(XMLHttpRequest.readyState);
                            console.error(textStatus);
                        }
                    });
                }
            });
            return false;
        });
        $(".cancel").click(function () {
            var index = parent.layer.getFrameIndex(window.name); // 先得到当前iframe层的索引
            parent.layer.close(index); // 再执行关闭
        });
        //添加支付信息
        $(".addzf").click(function () {
            var str = "<hr>\n" +
                "                    <div class=\"layui-row\">\n" +
                "                        <div class=\"layui-col-xs6\">\n" +
                "                            <label class=\"layui-form-label\">付款方式</label>\n" +
                "                            <div class=\"layui-inline\">\n" +
                "                                <select name=\"PAY_METHOD\" lay-verify=\"required\" lay-search=\"\">\n" +
                "                                    <option value=\"银行代扣\">银行代扣</option>\n" +
                "                                    <option value=\"现金\">现金</option>\n" +
                "                                </select>\n" +
                "                            </div>\n" +
                "                        </div>\n" +
                "                        <div class=\"layui-col-xs6\">\n" +
                "                            <label class=\"layui-form-label\">收款账户</label>\n" +
                "                            <div class=\"layui-inline\">\n" +
                "                                <select name=\"COLLECTION_TYPE\" lay-verify=\"required\" lay-search=\"\">\n" +
                "                                    <option value=\"公户\">公户</option>\n" +
                "                                    <option value=\"私户\">私户</option>\n" +
                "                                    <option value=\"代收费\">代收费</option>\n" +
                "                                </select>\n" +
                "                            </div>\n" +
                "                        </div>\n" +
                "                    </div>\n" +
                "                        <br>\n" +
                "                        <div class=\"layui-row\">\n" +
                "                            <div class=\"layui-col-xs6\">\n" +
                "                                <label class=\"layui-form-label\">支付流水号</label>\n" +
                "                                <div class=\"layui-inline\">\n" +
                "                                    <input type=\"text\" class=\"layui-input\" id=\"\" name=\"PAY_TRANSACTION\" placeholder=\"流水号\">\n" +
                "                                </div>\n" +
                "                            </div>\n" +
                "                            <div class=\"layui-col-xs6\">\n" +
                "                                <label class=\"layui-form-label\">实际支付日期</label>\n" +
                "                                <div class=\"layui-input-inline\">\n" +
                "                                    <input type=\"text\" class=\"layui-input\" id=\"PAY_DATE\" name=\"PAY_DATE\" placeholder=\"应收租日期\">\n" +
                "                                </div>\n" +
                "                            </div>\n" +
                "                        </div>\n" +
                "                    <div class=\"layui-row\">\n" +
                "                        <div class=\"layui-col-xs6\">\n" +
                "                            <label class=\"layui-form-label\">收款金额</label>\n" +
                "                            <div class=\"layui-inline\">\n" +
                "                                <input type=\"text\" class=\"layui-input\" id=\"PAY_PRICE\" name=\"PAY_PRICE\" placeholder=\"\" readonly>\n" +
                "                                <span class=\"label-money\">元</span>\n" +
                "                            </div>\n" +
                "                        </div>\n" +
                "                        <div class=\"layui-col-xs6\">\n" +
                "                            <label class=\"layui-form-label\">备注</label>\n" +
                "                            <div class=\"layui-inline\">\n" +
                "                                <input type=\"text\" class=\"layui-input\" id=\"INFO\" name=\"INFO\" placeholder=\"\">\n" +
                "                            </div>\n" +
                "                        </div>\n" +
                "                        <div class=\"layui-row\">\n" +
                "                            <input type=\"checkbox\" name=\"IS_RECEIPT\" lay-skin=\"primary\" title=\"发票\" checked=\"\">\n" +
                "                        </div>\n" +
                "                    </div>";

            $(".addzfxx").append(str);
            form.render("select");
            form.render("checkbox");
        });
        //删除支付信息
        $(".delzf").click(function () {
            $(".addzfxx").html("");
        });


        //多文件列表示例
        var files;
        var demoListView = $('#demoList')
            , uploadListIns = upload.render({
            elem: '#testList'
            , url: '/servlet/UploadHandleServlet'
            // ,accept: 'file'
            , multiple: true
            , auto: false
            , bindAction: '#testListAction'
            , choose: function (obj) {
                files = obj.pushFile(); //将每次选择的文件追加到文件队列
                //读取本地文件
                obj.preview(function (index, file, result) {
                    var tr = $(['<tr id="upload-' + index + '">'
                        , '<td><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img"></td>'
                        , '<td>' + file.name + '</td>'
                        , '<td>' + (file.size / 1014).toFixed(1) + 'kb</td>'
                        , '<td>等待上传</td>'
                        , '<td>'
                        , '<button class="layui-btn layui-btn-mini demo-reload layui-hide">重传</button>'
                        , '<button class="layui-btn layui-btn-mini layui-btn-danger demo-delete">删除</button>'
                        , '</td>'
                        , '</tr>'].join(''));

                    //单个重传
                    tr.find('.demo-reload').on('click', function () {
                        obj.upload(index, file);
                        return false;
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function () {
                        delete files[index]; //删除对应的文件
                        tr.remove();
                    });

                    demoListView.append(tr);
                });
            }
            , done: function (res, index, upload) {
                if (res.errcode == 0) { //上传成功
                    var obj = {};
                    obj.name = res.data.fileName;
                    obj.ext = res.data.extName;
                    obj.url = res.data.fileUrl;
                    uploadfiles.push(obj);
                    var tr = demoListView.find('tr#upload-' + index)
                        , tds = tr.children();
                    tds.eq(3).html('<span style="color: #5FB878;">上传成功</span>');
                    tds.eq(4).html(''); //清空操作
                    delete files[index]; //删除文件队列已经上传成功的文件
                    return;
                }
                this.error(index, upload);
            }
            , error: function (index, upload) {
                var tr = demoListView.find('tr#upload-' + index)
                    , tds = tr.children();
                tds.eq(3).html('<span style="color: #FF5722;">上传失败</span>');
                tds.eq(4).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
        });


    });

    var operate = {
        deleteImg: function (obj, id) {
            $(obj).parent().parent().remove();
            for (var i = 0; i < uploadfiles.length; i++) {
                if (uploadfiles[i].id == id) {
                    uploadfiles.splice(i, 1);
                }
            }
        }
    }

</script>
</body>
</html>